<?php
/* @var $this yii\web\View */

$this->title = '计算机详情';
?>
<style>
  .link_alert {
    cursor: pointer;
    text-decoration: underline;
    color: #3FB7EB;
  }
</style>
<section class="content" ng-app="myApp" ng-controller="myCtrl">

  <div class="row">
    <div class="col-md-12">
      <div class="box box-solid">
        <div class="box-header with-border">
          <h3 class="box-title" ng-class="sensor.isolate == 1 ? 'text-red' : ''">
            <i class="fa fa-laptop"></i>
            <span ng-bind="sensor.ComputerName"></span>
          </h3>

        </div>
        <!-- /.box-header -->
        <div class="box-body">
          <div class="row">
            <div class="col-md-6 border-right">
              <ul class="nav nav-stacked sensor-detail">
                <li>
                  <span class="sensor-detail-title">操作系统</span>
                  <span ng-bind="sensor.OSType"></span>
                </li>
                <li>
                  <span class="sensor-detail-title">所在域</span>
                  <span ng-bind="sensor.Domain"></span>
                </li>
                <li>
                  <span class="sensor-detail-title">IP地址</span>
                  <span ng-bind="sensor.IP"></span>
                </li>
                <li>
                  <span class="sensor-detail-title">配置文件</span>
                  <span ng-bind="sensor.ProfileVersion"></span>
                </li>
                <li>
                  <span class="sensor-detail-title">分组</span>
                  <span>
                    <span class="group-lable">
                      <a href="javascript:void(0);" ng-click="add();">加入分组</a>
                    </span>
                    <div class="alert alert-info alert-dismissible group-lable ng-cloak"
                      ng-repeat="item in sensor.groupList">
                      <span ng-bind="item.text"></span>
                      <span class="close" ng-click="del(item.id)">×</span>
                    </div>
                  </span>
                </li>
                <li>
                  <span class="sensor-detail-title">硬件信息</span>
                  <span class="link_alert" ng-click="showHardwareInfo()">列表</span>
                </li>
                <li>
                  <span class="sensor-detail-title">文件隔离</span>
                  <span class="link_alert" ng-click="FileIsolation()">列表</span>
                </li>

              </ul>
            </div>
            <div class="col-md-6 border-right">
              <ul class="nav nav-stacked sensor-detail">
                <li>
                  <span class="sensor-detail-title">状态</span>
                  <span class="label label-{{status_str[sensor.status].css}}" ng-bind="status_str[sensor.status].label"
                    ng-if="sensor.work != 1"></span>
                  <span class="label label-warning" ng-if="sensor.work == 1">请等待...</span>
                </li>
                <li>
                  <span class="sensor-detail-title">隔离</span>
                  <span>
                    <?php if (Yii::$app->user->identity->role == 'admin') {?>
                    <input class="tgl tgl-ios" id="isolate" type="checkbox" ng-checked="sensor.isolate == 1"
                      ng-click="isolate();" ng-disabled="sensor.work == 1 || sensor.status != 1">
                    <?php } else {?>
                    <input class="tgl tgl-ios" id="isolate" type="checkbox" ng-checked="sensor.isolate == 1"
                      ng-click="isolate();" ng-disabled="true">
                    <?php }?>
                    <label class="tgl-btn" for="isolate"></label>
                  </span>
                </li>
                <li>
                  <span class="sensor-detail-title">Sensor版本</span>
                  <span ng-bind="sensor.SensorVersion"></span>
                </li>
                <li>
                  <span class="sensor-detail-title">SensorID</span>
                  <span ng-bind="sensor.SensorID"></span>
                </li>
                <li>
                  <span class="sensor-detail-title">告警列表</span>
                  <span ng-bind="sensor.ComputerName" class="link_alert" ng-click="goAlert(sensor)"></span>
                </li>
                <!-- 资源监控 -->
                   <li>
                  <span class="sensor-detail-title">软件信息</span>
                  <span class="link_alert" ng-click="showSensorInfo()">列表</span>
                </li>
                <li>
                  <span class="sensor-detail-title">资源监控</span>
                  <span class="link_alert" ng-click="echartsInfo()">资源信息</span>
                </li>
              </ul>
            </div>
          </div>
          <!-- 弹窗 -->
          <div id="hide_box" style="display: none;">
            <div id="groupTree"></div>
            <!-- 软件信息 -->
            <table id="SoftwareInfoList" class="table table-hover selectSensor">
              <thead>
                <tr>
                  <th >软件名称</th>
                  <th>软件版本</th>
                </tr>
              </thead>
              <tbody>
                <tr ng-repeat="item in sensor.info.SoftwareInfoList">
                  <td ng-bind="item.DisplayName"></td>
                  <td ng-bind="item.DisplayVersion"></td>
                </tr>
                <tr ng-if="!sensor.info.SoftwareInfoList.length">
                  <td colspan="2">未检测到软件信息，请稍后查看</td>
                </tr>
              </tbody>
            </table>
            <!-- 硬件信息 -->
            <table id="showHardwareInfo" class="table table-hover selectSensor">
              <thead>
                <tr>
                  <th width="80">硬件</th>
                  <th>描述</th>
                </tr>
              </thead>
              <tbody>
                <tr ng-repeat="item in sensor.info.HardwareInfoList.HardwareInfoList">
                  <td ng-bind="item.HardwareName"></td>
                  <td ng-bind="item.HardwareInfo"></td>
                </tr>
                <tr ng-if="!sensor.info.SoftwareInfoList.length">
                  <td colspan="2">未检测到硬件信息，请稍后查看</td>
                </tr>
              </tbody>
            </table>
            <!-- 文件隔离列表 -->
            <div id="showFileInfo">
              <table class="table table-hover selectSensor">
                <thead>
                  <tr>
                    <th width="150">时间</th>
                    <th>文件名</th>
                    <th  >文件路径</th>
                    <th  >文件哈希</th>
                    <th  width="90">操作</th>
                  </tr>
                </thead>
                <tbody>
                  <tr ng-repeat="item in virusFileList.data">
                    <td  style="width:120px" ng-bind="item.updated_at*1000 | date: 'yyyy-MM-dd HH:mm:ss' "></td>
                    <td ng-bind="item.FileName"></td>
                    <td ng-bind="item.FilePath"></td>
                    <td ng-bind="item.md5"></td>
                    <td width="90">
                      <button type="button" ng-click="cancelVirusFile(item)">取消隔离</button>
                    </td>
                  </tr>
                  <!-- <tr ng-if="!sensor.info.SoftwareInfoList.length">
                  <td colspan="2">未检测到硬件信息，请稍后查看</td>
                </tr> -->
                </tbody>
              </table>

              <div class="row" style="margin:0">

                <div class="col-sm-12" style="min-height: 20px;">
                  <span>共<span ng-bind="virusFileList.count"></span>条记录</span>
                  <!-- angularjs分页 -->
                  <ul class="pagination pagination-sm no-margin pull-right" ng-if="virusFileList.count>0">
                    <li><a href="javascript:void(0);" ng-click="virusFile(virusFileList.pageNow-1)"
                        ng-if="virusFileList.pageNow>1">上一页</a></li>
                    <li><a href="javascript:void(0);" ng-click="virusFile(1)" ng-if="virusFileList.pageNow>1">1</a></li>
                    <li><a href="javascript:void(0);" ng-if="virusFileList.pageNow>4">...</a></li>

                    <li><a href="javascript:void(0);" ng-click="virusFile(virusFileList.pageNow-2)"
                        ng-bind="virusFileList.pageNow-2" ng-if="virusFileList.pageNow>3"></a></li>
                    <li><a href="javascript:void(0);" ng-click="virusFile(virusFileList.pageNow-1)"
                        ng-bind="virusFileList.pageNow-1" ng-if="virusFileList.pageNow>2"></a></li>

                    <li class="active"><a href="javascript:void(0);" ng-bind="virusFileList.pageNow"></a></li>

                    <li><a href="javascript:void(0);" ng-click="virusFile(virusFileList.pageNow+1)"
                        ng-bind="virusFileList.pageNow+1" ng-if="virusFileList.pageNow<virusFileList.maxPage-1"></a>
                    </li>
                    <li><a href="javascript:void(0);" ng-click="virusFile(virusFileList.pageNow+2)"
                        ng-bind="virusFileList.pageNow+2" ng-if="virusFileList.pageNow<virusFileList.maxPage-2"></a>
                    </li>


                    <li><a href="javascript:void(0);" ng-if="virusFileList.pageNow<virusFileList.maxPage-3">...</a></li>

                    <li><a href="javascript:void(0);" ng-click="virusFile(virusFileList.maxPage)"
                        ng-bind="virusFileList.maxPage" ng-if="virusFileList.pageNow<virusFileList.maxPage"></a></li>
                    <li><a href="javascript:void(0);" ng-click="virusFile(virusFileList.pageNow+1)"
                        ng-if="virusFileList.pageNow<virusFileList.maxPage">下一页</a></li>
                  </ul>
                  <!-- /.angularjs分页 -->
                </div>

              </div>
            </div>
            <div id="echarts_box">

              <div id="cpu">
              </div>
              <div id="disk">
              </div>
              <div id="flow_echarts">
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>

<script>
  var GroupList = <?=json_encode($GroupList)?> ;
  var rootScope;
  var app = angular.module('myApp', []);
  app.controller('myCtrl', function ($scope, $http, $filter, ) {
    rootScope = $scope;
    $scope.status_str = [{
      css: 'danger',
      label: '卸载'
    }, {
      css: 'success',
      label: '在线'
    }, {
      css: 'warning',
      label: '断线'
    }];
    $scope.virusFileList = {}
    $scope.isolate_str = ['text-blue', 'text-gray'];
    $scope.pause_str = ['glyphicon-play text-green', 'glyphicon-pause text-yellow'];
    $scope.work_str = ['', 'glyphicon-hourglass text-yellow', 'glyphicon-ok text-green',
      'glyphicon-remove text-red'
    ];
    $scope.scan_str = ['text-gray', 'text-blue'];

    function GetQueryString(name) {
      var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
      var r = window.location.search.substr(1).match(reg);
      if (r != null) return unescape(r[2]);
      return null;
    }
    $scope.isolate = function () {
      if ($scope.sensor.work == 1) {
        return;
      }
      $scope.sensor.work = 1;
      $scope.sensor.isolate = $scope.sensor.isolate == 1 ? 0 : 1;
      var types = ['ISOLATE_DOWN', 'ISOLATE_UP'];
      rqs_data = {
        type: types[$scope.sensor.isolate],
        SensorIDList: [$scope.sensor.SensorID]
      };
      var loading = zeroModal.loading(4);
      $http.post('sendbase', rqs_data).then(function success(rsp) {
        zeroModal.close(loading);
      }, function err(rsp) {
        zeroModal.close(loading);
      });
    }
    $scope.getOne = function () {
      $http.get('getone?sid=' + GetQueryString('sid') + '&temp=' + (new Date()).getTime()).then(
        function success(rsp) {
          $scope.pageGeting = true;
          if (rsp.data.status != "success") {
            return;
          }
          if (rsp.data.sensor.work != 1) {
            $scope.sensor = rsp.data.sensor;
            console.log($scope.sensor.info.HardwareInfoList);
          }
          $scope.pageGeting = false;
        },
        function err(rsp) {
          $scope.pageGeting = false;
        });
    }
    // 文件隔离列表
    // /sensor/virus-file-page
    $scope.virusFile = function (pageNow) {
      pageNow = pageNow ? pageNow : 1;
      let params = {
        "SensorID": GetQueryString('sid'), //计算机SensorID
        "page": pageNow, //请求页码
        "rows": 10 //请求数量
      }
      $http.post('/sensor/virus-file-page', params).then(function success(rsp) {
        console.log(rsp);
        $scope.virusFileList = rsp.data

      }, function err(rsp) {});
    }
    // 资源监控

    // 取消隔离文件
    $scope.cancelVirusFile = function (item) {
      $http.get('/sensor/relieve-file?id=' + item.id).then(
        function success(rsp) {
          console.log(rsp);
          $scope.virusFile()
        },
        function err(rsp) {});
    }
    $scope.SensorResource = function (item) {
      console.log(parseInt((new Date().getTime() - 8 * 60 * 60 * 1000) / 1000));
      console.log(parseInt((new Date().getTime()) / 1000));
      $http.get('/sensor/resource?SensorId=' + GetQueryString('sid') + '&start_date=' + parseInt((new Date()
        .getTime() - 6 * 60 * 60 * 1000) / 1000) + '&end_date=' + parseInt((new Date().getTime()) / 1000)).then(
        function success(rsp) {
          console.log(rsp);
          $scope.echarts(rsp.data.data)
        },
        function err(rsp) {});

    }

    $scope.echarts = function (data) {
      console.log(data);
      $scope.timeList = []
      $scope.cupList = []
      $scope.menList = []
      $scope.diskRead = []
      $scope.diskWrite = []
      $scope.diskList = []
      $scope.flowDownList = []
      $scope.flowUPList = []
      $scope.flowUnit = 'M bit/s'
      $scope.diskUnit = 'M bit/s'
      data.forEach((item) => {
        $scope.timeList.unshift(moment(item.date * 1000).format('YYYY-MM-DD HH:mm:ss'))
        $scope.cupList.unshift(item.resource.cpu.toFixed(2))
        $scope.menList.unshift(item.resource.memory.toFixed(2))
        $scope.diskRead.unshift((item.resource.disk_read*8).toFixed(2))
        $scope.diskWrite.unshift((item.resource.disk_write*8).toFixed(2))
        $scope.diskList.unshift((item.resource.disk_read*8).toFixed(2))
        $scope.flowDownList.unshift((item.resource.network_down*8).toFixed(2))
        $scope.flowUPList.unshift((item.resource.network_up*8).toFixed(2))
      })
      var diskArr = $scope.diskRead.concat($scope.diskWrite)
      var flowArr = $scope.flowDownList.concat($scope.flowUPList)
      var maxDiskArr = Math.max.apply(null, diskArr);
      var maxFlowArr = Math.max.apply(null, flowArr);
      $scope.cupList.forEach((item, index) => {
        if (item.split('.')[1] == '00') {
          $scope.cupList[index] = item.split('.')[0] * 1
        } else {
          $scope.cupList[index] = item * 1
        }
      })
      $scope.menList.forEach((item, index) => {
        if (item.split('.')[1] == '00') {
          $scope.menList[index] = item.split('.')[0] * 1
        } else {
          $scope.menList[index] = item * 1
        }
      })
      $scope.diskWrite.forEach((item, index) => {
        if (item.split('.')[1] == '00') {
          $scope.diskWrite[index] = item.split('.')[0] * 1
        } else {
          $scope.diskWrite[index] = item * 1
        }
      })
      $scope.diskRead.forEach((item, index) => {
        if (item.split('.')[1] == '00') {
          $scope.diskRead[index] = item.split('.')[0] * 1
        } else {
          $scope.diskRead[index] = item * 1
        }
      })
      $scope.flowDownList.forEach((item, index) => {
        if (item.split('.')[1] == '00') {
          $scope.flowDownList[index] = item.split('.')[0] * 1
        } else {
          $scope.flowDownList[index] = item * 1
        }
      })
      $scope.flowUPList.forEach((item, index) => {
        if (item.split('.')[1] == '00') {
          $scope.flowUPList[index] = item.split('.')[0] * 1
        } else {
          $scope.flowUPList[index] = item * 1
        }
      })
      if (maxDiskArr > 1) {
        $scope.diskUnit = 'M bit/s'
      } else {
        $scope.diskUnit = 'K bit/s'
        $scope.diskWrite.forEach((item, index) => {
          $scope.diskWrite[index] = item * 1024
        })
        $scope.diskRead.forEach((item, index) => {
          $scope.diskRead[index] = item * 1024
        })
      }
      if (maxFlowArr > 1) {
        $scope.flowUnit = 'M bit/s'

      } else {
        $scope.flowUnit = 'K bit/s'
        $scope.flowDownList.forEach((item, index) => {
          $scope.flowDownList[index] = item * 1024
        })
        $scope.flowUPList.forEach((item, index) => {
          $scope.flowUPList[index] = item * 1024
        })
      }
      $scope.cpu($scope.timeList, $scope.cupList, $scope.menList, $scope.diskList)
      $scope.disk($scope.timeList, $scope.diskRead, $scope.diskWrite, $scope.diskUnit)
      $scope.flow($scope.timeList, $scope.flowDownList, $scope.flowUPList, $scope.flowUnit)
    }

    $scope.cpu = function (timeList, cupList, menList, diskList) {
        var W = $(".content").width() * 0.8;
        var H = $(".zeromodal-body").height();
        $("#cpu").css({
          "width": W * .97 + "px",
          "height": (H / 3) + "px"
        })
        let myChart = echarts.init(
          document.getElementById("cpu")
        );
        // 绘制图表
        myChart.setOption({
          grid: {
            top: "18%",
            left: '5%',
            right: "3%",
            bottom: "20%",
            containLabel: true
          },
          legend: {
            bottom: 5,
            left: 'center',
            orient: 'horizontal',
            textStyle: {
              fontSize: 12
            },
            selected: {
              // 选中'系列1'
              'CPU': true,
              '内存': true,
            },
            data: ['CPU', '内存']
          },
          tooltip: {
            trigger: "axis",
            borderColor: "rgba(0,0,0,0)",
            borderWidth: 1,
            backgroundColor: "#fff",
            confine: true,
            extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);',
            textStyle: {
              color: "#ccc"
            },
            formatter: function (params) {
              let html = ''
              if (params[0]) {
                html = params[0].name + "<br/>" +
                  params[0].marker + params[0].seriesName + "：" + params[0].value + ' ' + "%<br/>"
              }
              if (params[1]) {
                html = params[0].name + "<br/>" +
                  params[0].marker + params[0].seriesName + "：" + params[0].value + ' ' + "%<br/>" +
                  params[1].marker + params[1].seriesName + "：" + params[1].value + ' ' + "%<br/>";
              }
              return html
            },
            axisPointer: {
              lineStyle: {
                color: "#ccc"
              }
            }
          },
          xAxis: {
            boundaryGap: false,
            //网格样式
            splitLine: {
              show: true,
              lineStyle: {
                color: ["#F4F4F4"],
                width: 1,
                type: "solid"
              }
            },
            axisLine: {
              lineStyle: {
                color: "#ECECEC",
                width: 2
              }
            },
            axisLabel: {
              textStyle: {
                color: "#666666"
              }
            },
            axisTick: {
              show: false
            },
            data: timeList,
          },
          yAxis: [{
            name: '单位(%)',
            min: 0,
            max: 100,
            nameTextStyle: {
              color: '#666'
            },
            splitLine: {
              show: true,
              lineStyle: {
                color: "#F4F4F4",
                width: 1,
                type: "solid"
              }
            },
            axisLine: {
              lineStyle: {
                color: "#ECECEC",
                width: 2
              }
            },
            axisLabel: {
              textStyle: {
                color: "#666666"
              }
            },
            axisTick: {
              show: false
            }
          }],
          color: ["rgba(2,136,209,0.9)", "rgba(205,220,57,0.9)"],
          visualMap: [{
            show: false,
            type: 'piecewise',
            seriesIndex: 0,
            pieces: [{
              gt: 85,
              color: '#dc5f5f'
            }, {
              gt: -1,
              lte: 85,
              color: "rgba(2,136,209,0.9)"
            }]
          }, {
            show: false,
            type: 'piecewise',
            seriesIndex: 1,
            pieces: [{
              gt: 85,
              color: '#dc5f5f'
            }, {
              gt: -1,
              lte: 85,
              color: "rgba(205,220,57,0.9)"
            }]
          }],
          series: [{
              name: "CPU",
              type: "line",
              symbol: "none",
              cursor: "pointer",
              smooth: true,
              // showAllSymbol: true //标注所有数据点
              data: cupList,
              areaStyle: {
                color: {
                  type: "linear",
                  x: 0,
                  y: 0,
                  x2: 0,
                  y2: 1,
                  colorStops: [{
                      offset: 0,
                      color: "rgba(2,136,209,0.3)" // 0% 处的颜色
                    },
                    {
                      offset: 1,
                      color: "rgba(2,136,209,0.1)" // 100% 处的颜色
                    }
                  ]
                }
              }
            },
            {
              name: "内存",
              type: "line",
              symbol: "none",
              cursor: "pointer",
              smooth: true,
              data: menList,
              areaStyle: {
                color: {
                  type: "linear",
                  x: 0,
                  y: 0,
                  x2: 0,
                  y2: 1,
                  colorStops: [{
                      offset: 0,
                      color: "rgba(205,220,57,0.3)" // 0% 处的颜色
                    },
                    {
                      offset: 1,
                      color: "rgba(205,220,57,0.1)" // 100% 处的颜色
                    }
                  ]
                }
              }
            },
          ]
        });
        window.addEventListener("resize", () => {
          myChart.resize();
        });
      },
      $scope.disk = function (timeList, diskRead, diskWrite, diskUnit) {
        //  console.log($(".zeromodal-body").height());
        var W = $(".content").width() * 0.8;
        //  var H = (W / 16) * 9;
        var H = $(".zeromodal-body").height();
        $("#disk").css({
          "width": W * .97 + "px",
          "height": (H / 3) + "px"
        })
        let myChart = echarts.init(
          document.getElementById("disk")
        );
        // 绘制图表
        myChart.setOption({
          grid: {
            top: "18%",
            left: '5%',
            right: "3%",
            bottom: "20%",
            containLabel: true
          },
          legend: {
            bottom: 5,
            left: 'center',
            orient: 'horizontal',
            textStyle: {
              fontSize: 12
            },
            selected: {
              // 选中'系列1'
              '硬盘读取': true,
              '硬盘写入': true,
            },
            data: ['硬盘读取', '硬盘写入']
          },
          tooltip: {
            trigger: "axis",
            borderColor: "rgba(0,0,0,0)",
            borderWidth: 1,
            extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);',
            backgroundColor: "#fff",
            textStyle: {
              color: "#ccc"
            },
            formatter: function (params) {
              let html = ''
              if (params[0]) {
                html = params[0].name + "<br/>" +
                  params[0].marker + params[0].seriesName + "：" + params[0].value + ' ' + diskUnit
              }
              if (params[1]) {
                html = params[0].name + "<br/>" +
                  params[0].marker + params[0].seriesName + "：" + params[0].value + ' ' + diskUnit + "<br/>" +
                  params[1].marker + params[1].seriesName + "：" + params[1].value + ' ' + diskUnit + "<br/>";
              }
              return html
            },
            axisPointer: {
              lineStyle: {
                color: "#ccc"
              }
            }
          },
          xAxis: {
            boundaryGap: false,
            //网格样式
            splitLine: {
              show: true,
              lineStyle: {
                color: ["#F4F4F4"],
                width: 1,
                type: "solid"
              }
            },
            axisLine: {
              lineStyle: {
                color: "#ECECEC",
                width: 2
              }
            },
            axisLabel: {
              textStyle: {
                color: "#666666"
              }
            },
            axisTick: {
              show: false
            },
            data: timeList,
          },
          yAxis: [{
            name: '单位(' + diskUnit + ')',
            nameTextStyle: {
              color: '#666'
            },
            splitLine: {
              show: true,
              lineStyle: {
                color: "#F4F4F4",
                width: 1,
                type: "solid"
              }
            },
            axisLine: {
              lineStyle: {
                color: "#ECECEC",
                width: 2
              }
            },
            axisLabel: {

              textStyle: {
                color: "#666666"
              }
            },
            axisTick: {
              show: false
            }
          }],
          color: ["rgba(76,175,80,0.9)", "rgba(205,220,57,0.9)", "rgba(76,175,80,0.9)"],
          series: [{
              name: "硬盘读取",
              type: "line",
              symbol: "none",
              cursor: "pointer",
              smooth: true,
              data: diskRead,
              areaStyle: {
                color: {
                  type: "linear",
                  x: 0,
                  y: 0,
                  x2: 0,
                  y2: 1,
                  colorStops: [{
                      offset: 0,
                      color: "rgba(76,175,80,0.3)" // 0% 处的颜色
                    },
                    {
                      offset: 1,
                      color: "rgba(76,175,80,0.1)" // 100% 处的颜色
                    }
                  ]
                }
              }
            },
            {
              name: "硬盘写入",
              type: "line",
              symbol: "none",
              cursor: "pointer",
              smooth: true,
              data: diskWrite,
              areaStyle: {
                color: {
                  type: "linear",
                  x: 0,
                  y: 0,
                  x2: 0,
                  y2: 1,
                  colorStops: [{
                      offset: 0,
                      color: "rgba(205,220,57,0.3)" // 0% 处的颜色
                    },
                    {
                      offset: 1,
                      color: "rgba(205,220,57,0.1)" // 100% 处的颜色
                    }
                  ]
                }
              }
            },

          ]
        });
        window.addEventListener("resize", () => {
          myChart.resize();
        });
      },
      $scope.flow = function (timeList, flowDownList, flowUPList, flowUnit) {
        var W = $(".content").width() * 0.8;
        //  var H = (W / 16) * 9;
        var H = $(".zeromodal-body").height();
        $("#flow_echarts").css({
          "width": W * .97 + "px",
          "height": (H / 3) + "px"
        })
        // 基于准备好的dom，初始化echarts实例
        let myChart = echarts.init(
          document.getElementById("flow_echarts")
        );
        // 绘制图表
        myChart.setOption({
          grid: {
            top: "18%",
            left: '5%',
            right: "3%",
            bottom: "20%",
            containLabel: true
          },
          legend: {
            bottom: 5,
            left: 'center',
            orient: 'horizontal',
            textStyle: {
              fontSize: 12
            },
            selected: {
              // 选中'系列1'
              '网络上行速度': true,
              '网络下行速度': true,
            },
            data: ['网络上行速度', '网络下行速度']
          },
          tooltip: {
            trigger: "axis",
            borderColor: "rgba(0,0,0,0)",
            extraCssText: 'box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);',
            borderWidth: 1,
            backgroundColor: "#fff",
            textStyle: {
              color: "#ccc"
            },
            formatter: function (params) {
              let html = ''
              if (params[0]) {
                html = params[0].name + "<br/>" +
                  params[0].marker + params[0].seriesName + "：" + params[0].value + ' ' + flowUnit
              }
              if (params[1]) {
                html = params[0].name + "<br/>" +
                  params[0].marker + params[0].seriesName + "：" + params[0].value + ' ' + flowUnit + "<br/>" +
                  params[1].marker + params[1].seriesName + "：" + params[1].value + ' ' + flowUnit + "<br/>";
              }
              return html
            },
            axisPointer: {
              lineStyle: {
                color: "#ccc"
              }
            }
          },
          color: ["rgba(187,120,247,0.9)", 'rgba(255,215,0,.9)'],
          xAxis: {
            boundaryGap: false,
            //网格样式
            splitLine: {
              show: true,
              lineStyle: {
                color: ["#F4F4F4"],
                width: 1,
                type: "solid"
              }
            },
            axisLine: {
              lineStyle: {
                color: "#ECECEC",
                width: 2
              }
            },
            axisLabel: {
              textStyle: {
                color: "#666666"
              }
            },
            axisTick: {
              show: false
            },
            data: timeList
          },
          yAxis: [{
            name: '单位(' + flowUnit + ')',
            nameTextStyle: {
              color: '#666'
            },
            splitLine: {
              show: true,
              lineStyle: {
                color: "#F4F4F4",
                width: 1,
                type: "solid"
              }
            },
            axisLine: {
              lineStyle: {
                color: "#ECECEC",
                width: 2
              }
            },
            axisLabel: {
              textStyle: {
                color: "#666666"
              }
            },
            axisTick: {
              show: false
            }
          }],
          series: [{
              name: "网络下行速度",
              type: "line",
              symbol: "none",
              cursor: "pointer",
              smooth: true,
              data: flowDownList,
              areaStyle: {
                color: {
                  type: "linear",
                  x: 0,
                  y: 0,
                  x2: 0,
                  y2: 1,
                  colorStops: [{
                      offset: 0,
                      color: "rgba(187,120,247,0.3)" // 0% 处的颜色
                    },
                    {
                      offset: 1,
                      color: "rgba(187,120,247,0.1)" // 100% 处的颜色
                    }
                  ]
                }
              }
            },
            {
              name: "网络上行速度",
              type: "line",
              symbol: "none",
              cursor: "pointer",
              smooth: true,
              data: flowUPList,
              areaStyle: {
                color: {
                  type: "linear",
                  x: 0,
                  y: 0,
                  x2: 0,
                  y2: 1,
                  colorStops: [{
                      offset: 0,
                      color: "rgba(187,120,247,0.3)" // 0% 处的颜色
                    },
                    {
                      offset: 1,
                      color: "rgba(187,120,247,0.1)" // 100% 处的颜色
                    }
                  ]
                }
              }
            },
          ]
        });
        window.addEventListener("resize", () => {
          myChart.resize();
        });
      }

    $scope.del = function (gid) {
      var rqs_data = {
        gid: gid,
        sid: $scope.sensor.id
      };
      var loading = zeroModal.loading(4);
      $http.post('delgroup', rqs_data).then(function success(rsp) {
        if (rsp.data.status == "success") {
          $scope.sensor.groupList = rsp.data.groupList;
        } else {
          zeroModal.error('分组删除失败!');
        }
        zeroModal.close(loading);
      }, function err(rsp) {
        zeroModal.error('分组删除失败!');
        zeroModal.close(loading);
      });
    }

    $scope.showSensorInfo = function () {
      var W = $(".content").width() * 0.8;
      var H = (W / 16) * 9;
      zeroModal.show({
        title: $scope.sensor.ComputerName,
        content: SoftwareInfoList,
        width: W + "px",
        height: H + "px",
        cancel: true,
        onCleanup: function () {
          hide_box.appendChild(SoftwareInfoList);
        }
      });
    }
    $scope.showHardwareInfo = function () {
      var W = $(".content").width() * 0.8;
      var H = (W / 16) * 9;
      zeroModal.show({
        title: $scope.sensor.ComputerName,
        content: showHardwareInfo,
        width: W + "px",
        height: H + "px",
        cancel: true,
        onCleanup: function () {
          hide_box.appendChild(showHardwareInfo);
        }
      });
    }
    $scope.echartsInfo = function () {
      var W = $(".content").width() * 0.8;
      var H = (W / 16) * 9;
      zeroModal.show({
        title: $scope.sensor.ComputerName + '的资源信息',
        content: echarts_box,
        width: W + "px",
        height: H + "px",
        cancel: true,
        onCleanup: function () {
          hide_box.appendChild(echarts_box);
        }
      });
      $scope.SensorResource()
    }

    // 文件隔离
    $scope.FileIsolation = function () {
      var W = $(".content").width() * 0.8;
      var H = (W / 20) * 9;
      zeroModal.show({
        title: '文件隔离列表',
        content: showFileInfo,
        width: W + "px",
        height: H + "px",
        cancel: true,
        onCleanup: function () {
          hide_box.appendChild(showFileInfo);
        }
      });
    }

    $scope.add = function () {
      var W = 480;
      var H = 360;
      zeroModal.show({
        title: '请选计算机分组！',
        content: groupTree,
        width: W + "px",
        height: H + "px",
        ok: true,
        cancel: true,
        okFn: function () {
          if (!$scope.nowGroup) {
            zeroModal.error('请选计算机分组！');
            return false;
          }
          var rqs_data = {
            gid: $scope.nowGroup.id,
            sid: $scope.sensor.id
          };
          var loading = zeroModal.loading(4);
          $http.post('addgroup', rqs_data).then(function success(rsp) {
            if (rsp.data.status == "success") {
              $scope.sensor.groupList = rsp.data.groupList;
            } else {
              zeroModal.error('只能加入一个分组!');
            }
            zeroModal.close(loading);
          }, function err(rsp) {
            zeroModal.error('分组加入失败!');
            zeroModal.close(loading);
          });
        },
        onCleanup: function () {
          hide_box.appendChild(groupTree);
        }
      });
    }
    $scope.goAlert = function (sensor) {
      location.pathname = "/alert/index";
      console.log(sensor);
      localStorage.setItem("parmas", sensor.ComputerName);
      localStorage.setItem("SensorID", sensor.SensorID);
    }
    $scope.pageGeting = false;
    $scope.getOne();
    $scope.virusFile();
    // $scope.SensorResource();
    setInterval(function () {
      if (!$scope.pageGeting) {
        $scope.getOne();
      }
    }, 5000);
  });


  var GroupTree = [];
  var Groups = {};
  console.log(111111);
  console.log(GroupList);
  // let newGroupList = []
   GroupList.forEach((item)=>{
    //  item.state={}
    //  item.state.expanded=true
    //  item.state.disabled=false
    if(item.type!='1'){
      // newGroupList.push(item)
      item.nodes=null
      GroupTree.push(item)
    }
  })
  // newGroupList.map((item)=>{

  // })
  // for (var i = 0; i < newGroupList.length; i++) {
  //   // var group = GroupList[i];
  //   // Groups[group.id] = group;
  //   // group.type = '' + group.type;
  //   if (group.pid == 0) {
  //     GroupTree.push(group);
  //   } else {
  //     if (!Groups[group.pid].nodes) {
  //       Groups[group.pid].nodes = [];
  //     }
  //     Groups[group.pid].nodes.push(group);
  //   }
  // }
  var treeDom;
  console.log(GroupTree);
  // state.disabled


  function updateTree() {
    treeDom = $('#groupTree').treeview({
      color: "#428bca",
      data: GroupTree,
      // levels: 10,
      // showCheckbox: true,
      // multiSelect: false,
      // highlightSelected: false,
      onNodeSelected: function (event, node) {
        rootScope.nowGroup = node;
        rootScope.$apply();
      },
      onNodeUnselected: function (event, node) {
        rootScope.nowGroup = null;
        rootScope.$apply();
      }
    });
    var nodes = treeDom.treeview('getUnselected');
    Nodes = {};
    for (var i = nodes.length - 1; i >= 0; i--) {
      var node = nodes[i];
      Nodes[node.id] = node;
    }
  }
  window.onload = function () {
    updateTree();
  };
</script>
<style>
td{word-break: break-all; word-wrap:break-word;}
  #cpu,
  #flow_echarts,
  #disk {
    /* width:800px; */
    /* height:200px; */
    /* border:1px solid red; */
  }
</style>